<nz-spin [nzSpinning]="loading">
  <ng-template #infoTpl>
      <div> {{'产品季:' + _start + '~' + _end}}</div>
      <div> {{'近一年:' + _start1 + '~' + _end1}}</div>
  </ng-template>
  <h4 class="card__title">
    <span>{{title}} <i nz-tooltip [nzTooltipTitle]="infoTpl" style="cursor: pointer; color: gray" nz-icon nzType="info-circle"
      nzTheme="outline"></i></span>      
    <nz-radio-group [(ngModel)]="showType" nzSize="small">
      <label nz-radio-button nzValue="chart"><i nz-icon nzType="pie-chart"></i></label>
      <label nz-radio-button nzValue="list"><i nz-icon nzType="table"></i></label>
    </nz-radio-group>
  </h4>
  <div nz-row nzGutter="16">
    <div nz-col nzSpan="24" [ngStyle]="{height: data.length === 0 ? '160px' : 'inherit'}">
      <nz-empty *ngIf="data.length === 0"></nz-empty>
      <g2-custom *ngIf="!loading && data.length != 0" [hidden]="showType == 'list'" (render)="render($event)">
      </g2-custom>
      <div *ngIf="data.length != 0" [hidden]="showType == 'chart'">
        <nz-table [nzData]="table" [nzNoResult]="''" [nzShowPagination]="false" nzSize="small"
          [nzScroll]="{ y: '117px' }" class="d-block" style="min-height: 160px; margin-top: 30px">
          <thead>
            <tr>
              <th>渠道</th>
              <th nzWidth="150px">近一年{{type === 's' ? '实' : '代'}}销</th>
              <th nzWidth="150px">产品季{{type === 's' ? '实' : '代'}}销</th>
            </tr>
          </thead>
          <tbody>
            <tr *ngFor="let i of table">
              <td>{{ i.type }}</td>
              <td>{{ i.value2 }}</td>
              <td>
                <trend *ngIf="+i.value > +i.value2" flag="up">{{i.value}}</trend>
                <trend *ngIf="+i.value < +i.value2" flag="down">{{i.value}}</trend>
                <span *ngIf="i.value === i.value2">{{i.value}}</span>
              </td>
            </tr>
          </tbody>
        </nz-table>
      </div>
    </div>
  </div>
  <div class="card__time" [ngStyle]="{ visibility: time ? 'visible' : 'hidden' }">更新于: {{ time | _date }}</div>
</nz-spin>
